<template>
	<div class="input-component">
		<template v-if="type=='tel'">
			<input type="tel" :placeholder='placeholder' :value="value" @input="telInput($event)" />
		</template>
		<img class="clear ui-img" @click="clear($event)" v-show="!(value==null||value==undefined||value=='')" src="./eliminate.png" alt="" />
		<!--<input v-else type="text" :value="value" @input="$emit('input', $event.target.value)" />-->
	</div>

</template>

<script>
	export default {
		props: {
			value: {
				default: null
			},
			type: {
				type: String,
				default: 'tel'
			},
			placeholder: {
				type: String,
				default: '请输入...'
			}
		},
		data() {
			return {
				validateValue: null
			}
		},
		mounted() {
			this.validateValue = this.value;
		},
		methods: {
			clear(ev){
				$(ev.target).prevAll('input').val('');
				this.validateValue = null;
				this.$emit('input', null);
			},
			telInput(ev) {
				let value = ev.target.value;
				let reg = new RegExp(/^\d+$/);
				console.log(value, reg.test(value))
				if(value === '0') {
					value = null;
				}
				if(value && !reg.test(value)) {
					value = this.validateValue;
				}

				value = parseInt(value); // 解析字符串返回整数
				console.log(value)
				if(isNaN(value)) {
					value = null;
				}
				if(value && value.toString().length > 11) {
					value = this.validateValue;
					$(ev.target).val(value);
					return;
				}
				//				$(ev.target).val(null); //清除.
				$(ev.target).val(value);
				this.validateValue = value;
				this.$emit('input', value);
			},
			checkFloatNumber(val) {
				let reg = new RegExp(/^[0-9]+(.[0-9]{1,2})?$/);
				let length_1 = val.length - 1;
				let length_2 = val.length - 2;

				if(val) { // 当输入了值
					if(!reg.test(val)) { // 并且值不合法
						if(reg.test(val.substr(0, length_1))) { // 如果除去最后一位前面的合法
							if(val.charAt(length_1) == '.' && val.indexOf('.') == length_1) {
								// 当最后一位为小数点并且值中只有一个小数点，则保留值
								this.inputNum = val;
							} else {
								// 否则去掉最后一位
								this.inputNum = val.substr(0, length_1);
							}
							// 如果除去最后两位前面的合法并且最后两位都是小数点，就去掉最后一位
						} else if(reg.test(val.substr(0, length_2)) && val.charAt(length_1) == '.' && val.indexOf('.') == length_2) {
							this.inputNum = val.substr(0, length_1);
							// 否则
						} else {
							// 如果值只有一位且是小数点，或者值有两位且是‘0.’，则把值置为‘0.’
							if(val == '.' || val.substr(0, length_1) == '0.') {
								this.inputNum = '0.';
							} else {
								// 否则提示并清空
								let instance = Toast('请输入正确的数值');
								setTimeout(() => {
									instance.close();
									this.inputNum = '';
								}, 2000);
							}
						}
					} else {
						// 值合法的时候
						// 如果第一位为0且第二位存在且第二位不是小数点，提示并清空值
						if(val.charAt(0) == 0 && val.charAt(1) && val.charAt(1) !== '.') {
							let instance = Toast('请输入正确的数值');
							setTimeout(() => {
								instance.close();
								this.inputNum = '';
							}, 2000);
						} else {
							// 否则保留值
							this.inputNum = val;
						}
					}
				}

			}
		}
	}
</script>
<style lang="less">
	@import '../../less/base/base.less';
	.input-component {
		position: relative;
		display: inline-block;
		margin: 0;
		padding: 0;
		border: none;
		.clear{
			position:absolute;
			right:10px;
			top:50%;
			transform: translateY(-50%)
		}
	}
</style>